<?php
use frontend\assets\AppAsset;

AppAsset::addCss($this,'@web/css/swiper.min.css');
AppAsset::addCss($this,'@web/js/photoswipe.css');
AppAsset::addCss($this,'@web/js/default-skin/default-skin.css');
AppAsset::addCss($this,'@web/css/house_detail.css?t='.time());
AppAsset::addScript($this,'@web/js/photoswipe.min.js');
AppAsset::addScript($this,'@web/js/photoswipe-ui-default.js');
AppAsset::addScript($this,'@web/js/house_detail.js?t='.time());

$this->title = '楼盘详情';
?>

<div id="main_page" >
    <div class="house_summary">
        <h2 class="house_name"></h2>
        <a id="btn_attention" type="button" href="javascript:void(0);">+关注</a>
        <div class="album_prev">
            <img class="prev_img" src="../images/house_default.png" />
            <img class="album_icon" src="../images/tpj.png" />
        </div>

        <div class="price_info clearfix">
            <div class="price_left">
                <b>0</b><span>元/㎡</span>
            </div>
            <div class="price_right clearfix">
                <div class="return_img"><img src="/images/logo_small.png" /></div>
                <div class="return_des">
                    <p>底价再返现</p>
                    <p class="return_price">0万/套</p>
                </div>
            </div>
        </div>

        <div class="house_info_primary">
            <ul class="clearfix">
                <li>
                    <img class="primary-icon" src="../images/dz.png" />
                    <span>详细地址</span>
                    <img class="primary-arrow" src="../images/icon_arrow_right.png" />
                </li>
                <li>
                    <img class="primary-icon" src="../images/kfs.png" />
                    <span>开发公司</span>
                </li>
                <li>
                    <img class="primary-icon" src="../images/wy.png">
                    <span>物业公司</span>
                </li>
                <li>
                    <img class="primary-icon" src="../images/jsq.png">
                    <span></span>
                                        <img class="primary-arrow" src="../images/icon_arrow_right.png" />
                </li>
                <li>
                    <img class="primary-icon" src="../images/zc.png">
                    <span></span>
                </li>
            </ul>
        </div>

        <div class="house_parameter clearfix">
            <ul>
                <li>物业类型：<span></span></li>
                <li>产权年限：<span></span></li>
                <li>预计交房：<span>时间待定</span></li></ul>
                <li>建筑类型：<span></span></li>
                <li>建筑面积：<span>--</span></li>
                <li>占地面积：<span>--</span></li>
                <li>容积率：<span>0</span></li>
                <li>绿化率：<span>0%</span></li>
                <li>规划户数：<span>0</span></li>
                <li>车位数：<span>0</span></li></ul>
                <li>装修类型：<span></span></li>
                <li>物业费：<span>0.00元/平米/月</span></li>
                <li>返现周期：<span>0天</span></li>
            </ul>
        </div>

        <div class="house_flat">
            <div class="house_flat_title">
                <h2>主力户型</h2>
            </div>
            <ul class="house_flat_list" id="house_flat_list">
               <!-- <li class="clearfix">
                    <div class="flat_img"><img alt="楼盘户型" src="//fs.fangdd.com/image/WPeGalQbikP5ggB3tbkZHD4qq_g.png?imageMogr2/thumbnail/!100x75r/format/jpg"></div>
                    <div class="flat_des"><p><b>90平米平层户型</b></p><p>3室2厅2卫&nbsp;90m²</p></div>
                   <div class="flat_price"><p><span>117</span>万起</p></div>
               </li> -->
            </ul>
        </div>

        <div class="house_infomation">
            <div class="house_info_title">
                <h2>楼盘动态</h2>
            </div>
            <ul class="house_info_list" id="house_info_list">
               <!-- <li>
                    <p>预算大多在500万左右，主要是奔着90平左右的小两房来的，特别是内环内500万、郊环内400万、郊环外250万的地铁房尤为抢手。</p>
               </li>-->
            </ul>
        </div>

        <div class="house_recommend">
            <div class="house_category">
                <div class="category_square"></div>&nbsp;&nbsp;&nbsp;楼盘推荐<div class="clearfix"></div>
            </div>
            <ul class="house_list">

            </ul>
        </div>
    </div>
</div>

<div class="contact_bar">
    <div class="contact_logo">
        <img src="/images/logo_small.png">
        <p>口袋买房</p>
    </div>
    <div class="contact_button">
        <a id="btn_report" type="button" class="btn-success btn" href="javascript:void(0);">在线报备</a>
        <a id="btn_contact" type="button" class="btn-success btn" href="javascript:void(0);">在线沟通</a>
        <ul class="online_selector">
            <li><img src="../images/chat_online.png" /><a id="btn_chat_online" type="button" class="btn" href="javascript:void(0);">在线客服</a></li>
            <li><img src="../images/chat_mobile.png" /><a id="btn_chat_mobile" type="button" class="btn" href="javascript:void(0);">电话联系</a></li>
        </ul>
    </div>
</div>

<div id="report_box">
    <div id="report_title"><p>在线报备</p></div>
    <div id="report_tips">(预约看房至少要提前1天)</div>
    <form>
        <div id="report_type">
            <label class="radio-inline">
                <input type="radio" name="opt_report_type" id="opt_report_type1" checked value="自看"> 自看
            </label>
            <label class="radio-inline">
                <input type="radio" name="opt_report_type" id="opt_report_type2" value="推荐"> 推荐
            </label>
        </div>

        <div class="form-group">
            <label for="exampleInputEmail1">联系人</label>
            <input type="text" class="form-control" id="contact" maxlength="20" placeholder="">
        </div>
        <div class="form-group">
            <label for="exampleInputEmail1">联系电话</label>
            <input type="tel" class="form-control" id="mobile" maxlength="11"  placeholder="">
        </div>

        <div id="report_btns">
            <button id="btn_saveReport" type="button" class="btn btn-success">确认提交</button>
            <button id="btn_cancelReport" type="button" class="btn btn-default">关闭</button>
        </div>

    </form>

</div>

<div class="mask"></div>

<!-- Root element of PhotoSwipe. Must have class pswp. -->
<div class="pswp" tabindex="-1" role="dialog" aria-hidden="true">

    <!-- Background of PhotoSwipe.
         It's a separate element as animating opacity is faster than rgba(). -->
    <div class="pswp__bg"></div>

    <!-- Slides wrapper with overflow:hidden. -->
    <div class="pswp__scroll-wrap">

        <!-- Container that holds slides.
            PhotoSwipe keeps only 3 of them in the DOM to save memory.
            Don't modify these 3 pswp__item elements, data is added later on. -->
        <div class="pswp__container">
            <div class="pswp__item"></div>
            <div class="pswp__item"></div>
            <div class="pswp__item"></div>
        </div>

        <!-- Default (PhotoSwipeUI_Default) interface on top of sliding area. Can be changed. -->
        <div class="pswp__ui pswp__ui--hidden">

            <div class="pswp__top-bar">

                <!--  Controls are self-explanatory. Order can be changed. -->

                <div class="pswp__counter"></div>

                <button class="pswp__button pswp__button--close" title="Close (Esc)"></button>

                <button class="pswp__button pswp__button--share" title="Share"></button>

                <button class="pswp__button pswp__button--fs" title="Toggle fullscreen"></button>

                <button class="pswp__button pswp__button--zoom" title="Zoom in/out"></button>

                <!-- Preloader demo http://codepen.io/dimsemenov/pen/yyBWoR -->
                <!-- element will get class pswp__preloader--active when preloader is running -->
                <div class="pswp__preloader">
                    <div class="pswp__preloader__icn">
                        <div class="pswp__preloader__cut">
                            <div class="pswp__preloader__donut"></div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="pswp__share-modal pswp__share-modal--hidden pswp__single-tap">
                <div class="pswp__share-tooltip"></div>
            </div>

            <button class="pswp__button pswp__button--arrow--left" title="Previous (arrow left)">
            </button>

            <button class="pswp__button pswp__button--arrow--right" title="Next (arrow right)">
            </button>

            <div class="pswp__caption">
                <div class="pswp__caption__center"></div>
            </div>

        </div>

    </div>

</div>
<!---->
<!--<script src='//kefu.easemob.com/webim/easemob.js?configId=666a1310-a661-4c09-b9e3-8bc1c87764f3'></script>-->


<!-- 报备功能（描述：提示预约看房至少要提前1天、选项：自看；推荐、联系人、联系电话） -->
